<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>教师管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <link href="//unpkg.com/layui@2.9.20/dist/css/layui.css" rel="stylesheet">
    <script src="//unpkg.com/layui@2.9.20/dist/layui.js"></script>
    <script src="./echarts.js"></script>
    <link rel="stylesheet" href="./js.css">
    <script src="./jsgl.js"></script>
</head>

<body>
    <div class="layui-layout layui-layout-admin" style="font-weight: 800; color: #ff0606;">
        <div class="layui-header">
            <div class="layui-logo layui-hide-xs layui-bg-black">
                <a href="./register.html">
                    <img src="../图片/t0400bb2c9d6fb30cbd.png" class="layui-nav-img">
                </a>教师管理系统
            </div>
            <!-- 头部区域（可配合layui 已有的水平导航） -->
            <ul class="layui-nav layui-layout-left">
                <!-- 移动端显示 -->
                <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
                    <i class="layui-icon layui-icon-spread-left"></i>
                </li>
                <li class="layui-nav-item layui-hide-xs">
                    <a href="javascript:;">分类管理</a>
                </li>
                <li class="layui-nav-item layui-hide-xs">
                    <a href="javascript:;">表单首页</a>
                </li>
                <li class="layui-nav-item layui-hide-xs">
                    <a href="javascript:;">商品列表</a>
                </li>
            </ul>
            <ul class="layui-nav layui-layout-right">
                <li class="layui-nav-item layui-hide layui-show-sm-inline-block">
                    <a href="javascript:;">
                        <img src="../图片/20200106171335_tUa5x.jpeg" class="layui-nav-img">个人中心
                    </a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="./register.html">注册页面</a>
                        </dd>
                        <dd>
                            <a href="./login.html">登录页面</a>
                        </dd>
                        <dd>
                            <a href="./register.html" onclick="on()">退出登录</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
                    <a href="javascript:;">
                        <i class="layui-icon layui-icon-more-vertical"></i>
                    </a>
                </li>
            </ul>
        </div>
        <div class="layui-side layui-bg-black">
            <div class="layui-side-scroll">
                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                <ul class="layui-nav layui-nav-tree" lay-filter="test">
                    <li class="layui-nav-item layui-nav-itemed">
                        <a class="" href="./仪表盘.html">
                            仪表盘
                        </a>
                    </li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">分类管理</a>

                    </li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">讲师管理</a>

                    </li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">
                            课程管理
                        </a>
                        <dl class="layui-nav-child">
                            <dd> 
                                <a href="javascript:;">
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;">
                                </a>
                            </dd>
                            <dd>
                                <a href="javascript:;">
                                </a>
                            </dd>
                        </dl>
                    </li>
                </ul>
            </div>
        </div>
        <div class="layui-body">
            <!-- 内容主体区域 -->
            <div style="padding: 15px;">
                <blockquote class="layui-elem-quote layui-text">
                    <span style="color: #018bfcb5;">讲师管理</span> /
                    <span style="color: #818486;">讲师列表</span>
                </blockquote>
                <div class="layui-card layui-panel">
                    <div class="layui-card-header">
                        <button class="add" onclick="kuang()">添加教师</button>
                    </div>
                    <div class="layui-card-body" style="font-weight: 800; font-size: 17px;">
                        <div class="zhu">
                            <input type="text" class="content"><button class="sou" onclick="sou()">搜索</button>
                            <table class="layui-table">
                                <thead>
                                    <tr>
                                        <th>编号</th>
                                        <th>姓名</th>
                                        <th>昵称</th>
                                        <th>出生日期</th>
                                        <th>性别</th>
                                        <th>手机号码</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody id="data-list">
                                </tbody>
                            </table>
                        </div>
                        <div class="tea" style="margin-left: 400px;display: none;">
                            <table>
                                <tbody>
                                    <tr>
                                        <td>姓名:</td>
                                        <td style="padding-left: 15px;"><input type="text" placeholder="讲师名称"></td>
                                    </tr>
                                    <tr>
                                        <td>昵称:</td>
                                        <td style="padding-left: 15px;"><input type="text"></td>
                                    </tr>
                                    <tr>
                                        <td>生日:</td>
                                        <td style="padding-left: 15px;"><input type="text"></td>
                                    </tr>
                                    <tr>
                                        <td>手机号:</td>
                                        <td style="padding-left: 15px;"><input type="text"></td>
                                    </tr>
                                    <tr>
                                        <td>性别:</td>
                                        <td style="padding-left: 15px;">
                                            <input type="radio" class="gend" value="0" name="1">男♂
                                            <input type="radio" class="gend" value="1" name="1">女♀
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <button onclick="add()"
                                style="background-color: #5cb85c;color: white;border: none;padding: 4px 5px;margin-left: 200px;border-radius: 3px;">添加</button>
                        </div>
                        <div class="geren" style="display: none;">
                            <table border="0px">
                                <tbody>
                                    <tr>
                                        <td>姓名:</td>
                                        <td style="padding-left: 15px;"><span class="nam"></span></td>
                                    </tr>
                                    <tr>
                                        <td>头像:</td>
                                        <td style="padding-left: 15px;">
                                            <img src="../图片/t0160182972d655a8f5.jpg">
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>昵称:</td>
                                        <td style="padding-left: 15px;"><input type="text" class="nic"></td>
                                    </tr>
                                    <tr>
                                        <td>性别:</td>
                                        <td style="padding-left: 15px;">
                                            <input type="radio" class="gender" value="0" name="0">男♂
                                            <input type="radio" class="gender" value="1" name="0">女♀
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>出生日期:</td>
                                        <td style="padding-left: 15px;"><input type="text" class="birda">
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>省市区:</td>
                                        <td style="padding-left: 15px;">
                                            <select>
                                                <option value="天津市">天津市</option>
                                            </select>
                                            <select>
                                                <option value="市辖区">市辖区</option>
                                            </select>
                                            <select>
                                                <option value="东城区">东城区</option>
                                            </select>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>手机号码</td>
                                        <td style="padding-left: 15px;"><input type="text" class="ipon"></td>
                                    </tr>
                                    <tr>
                                        <td>电子邮箱</td>
                                        <td style="padding-left: 15px;"><input type="text" class="eml"></td>
                                    </tr>
                                    <tr>
                                        <td>入职日期</td>
                                        <td style="padding-left: 15px;"><input type="text" class="in">
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>个人介绍</td>
                                        <td style="padding-left: 15px;"><textarea>无</textarea></td>
                                    </tr>
                                </tbody>
                            </table>
                            <button onclick="ok()" style="padding: 7px 15px;margin-left: 100px;">确定</button>
                        </div>
                        <div class="bji" style="display: none;">
                            姓名: <input type="text"><br>
                            出生日期: <input type="text"><br>
                            性别: <input type="radio" name="1" value="0" class="xbie"> 男 ♂
                            <input type="radio" name="1" value="1" class="xbie"> 女♀<br>
                            <button style="background: #510202;" class="bj" onclick="gai()">编辑</button>
                        </div>
                        <div class="xingxi" style=" font-weight: 800;font-size: 17px;">
                            姓名:<input type="text"><br><br>
                            手机号码: <input type="text"><br><br>
                            昵称:<input type="text"><br><br>
                            生日:<input type="text"><br><br>
                            邮箱:<input type="text"><br><br>
                            入职时间:<input type="text"><br><br>
                            <button onclick="tianjia()" style="padding: 6px 15px;">添加</button>
                        </div>
                        <div class="tubiao" style="display: none;">
                            <div class="num" style="background-color: #39fce2;">
                                <!-- <img src=""> -->
                                <div
                                    style="display: inline-block;margin-top: 25px;color: white;position: fixed;margin-left: 10px;">
                                    我的收入:<br>￥1000.00
                                 </div>
                            </div>
                            <div class="num" style="background-color: #5ab6df;">
                                <!-- <img src=""> -->
                                <div
                                    style="display: inline-block;margin-top: 25px;color: white;position: fixed;margin-left: 10px;">
                                    课程数量:<br>45
                                </div>
                            </div>
                            <div class="num" style="background-color: #65cea7;">
                                <!-- <img src="" style="width: 50px;height: 60px;"> -->
                                <div
                                    style="display: inline-block;margin-top: 25px;color: white;position: fixed;margin-left: 10px;">
                                    用户数量:<br>2306
                                </div>
                            </div>
                            <div class="num" style="background-color: #ebc85e;">
                                <!-- <img src=""> -->
                                <div
                                    style="display: inline-block;margin-top: 25px;color: white;position: fixed;margin-left: 10px;">
                                    浏览量:<br>322435
                                </div>
                            </div>
                            <div id="main" style="width: 500px;height: 450px;display: inline-block;"></div>
                            <div id="main1" style="width: 500px;height: 450px;display: inline-block;"></div>
                        </div>
                    </div>
                </div>
                <br>
            </div>
        </div>
        <div class="layui-footer">
            <div class="footer">
                <span class="numInfo">分页信息:</span>
                <input type="button" class="green-button" onclick="fetchData(currentPage - 1)" value="上一页">
                <span id="current-page">1</span> / <span id="total-pages">1</span>
                <input type="button" class="red-button" onclick="fetchData(currentPage + 1)" value="下一页">
            </div>
        </div>
    </div>

    <script>
        //JS 
        layui.use(['element', 'layer', 'util'], function () {
            var element = layui.element;
            var layer = layui.layer;
            var util = layui.util;
            var $ = layui.$;

            //头部事件
            util.event('lay-header-event', {
                menuLeft: function (othis) { // 左侧菜单事件
                    layer.msg('展开左侧菜单的操作', {
                        icon: 0
                    });
                },
                menuRight: function () { // 右侧菜单事件
                    layer.open({
                        type: 1,
                        title: '更多',
                        content: '<div style="padding: 15px;"><img src="../图片/t0160182972d655a8f5.jpg"></div>',
                        area: ['260px', '100%'],
                        offset: 'rt', // 右上角
                        anim: 'slideLeft', // 从右侧抽屉滑出
                        shadeClose: true,
                        scrollbar: false,
                    });
                }
            });
        });

        function on() {
            localStorage.clear()
            location.assign('./register.html')
        };
    </script>

</body>

</html>